let active = true;
let role = localStorage['role'];
localStorage['pwd'] = '';
localStorage['mainUrl'] = '';

window.onload = function () {
    window.navigationVue = new Vue({
        el: '#nav',
        data: {
            title: '人员管理',
            subTitle: '安装师傅',
            showCloseButton: false,
            closeButton: '关闭',
        },
        methods: {
            close: function () {
                let m = $('#main-content1')[0];
                $('#main-content')[0].style.display = 'inline';
                m.style.display = 'none';
                m.src = '';
                this.showCloseButton = false;
                localStorage['showCloseButton'] = false;
                localStorage['mainUrl'] = '';
                hideKey();
            },
        },
        watch: {
            subTitle(cur, old) {
                vue.subTitle = cur;
            }
        }
    });
    let headerVue = new Vue({
        el: '#main-header',
        data: {
            userName: '',
            location: '',
            messages: [],
            hasMessage: false,
            messageCount: 0,
            role: '',
        },
        methods: {
            logout: function () {
                doGet({
                    url: 'user/user/logout',
                    callback: function (res) {
                        if (res.data.code === 1) {
                            let home = getLocalStorage('home', 'index.html');
                            localStorage.clear();
                            localStorage['home'] = home;
                            window.location.href = 'login.html?c=' + getQueryVariable('c');
                        }
                    }
                });
            },

            openMenu: function (url) {
                window.location = url;
                localStorage['home'] = url;
            }
        },
    });

    window.vue = new Vue({
        el: '#menu',
        data: {
            location: '',
            selectedMenu: '',
            menus: [],
            menuCount: 0,
        },
        methods: {
            menu: function (title) {
                if (title === this.selectedMenu) {
                    return active;
                }
                return null;
            },
            changeContent: function (title, subTitle, url, menuId) {
                navigationVue.title = title;
                navigationVue.subTitle = subTitle;
                this.selectedMenu = navigationVue.subTitle;
                setupContent(url);

                localStorage['click_menu'] = title;
                localStorage['click_sub_menu'] = subTitle;

                if (role === 'ROOT') {
                    doGet({
                        url: 'user/menu/save_cur_menu',
                        data: {
                            menu: title,
                            sub_menu: subTitle,
                        },
                        callback: function (res) {

                        }
                    }, false);
                }

                vue.clickMenu(menuId);
            },
            clickMenuItem: function (menu, subMenu) {
                for (let i = 0; i < vue.menus.length; i++) {
                    let m = vue.menus[i].menu;
                    if (menu === m) {
                        let menu_id = vue.menus[i]['menu_id'];
                        let sms = vue.menus[i].sub_menu;
                        for (let j = 0; j < sms.length; j++) {
                            if (sms[j].menu === subMenu) {
                                vue.changeContent(m, subMenu, sms[j].url, menu_id);
                                return;
                            }
                        }
                    }
                }
            },


            clickMenu: function (index) {
                for (let i = 0; i < vue.menus.length; i++) {
                    let mm = $('#menu' + i);
                    mm.removeClass();
                    if (index === i) {
                        mm.addClass('treeview active');
                    } else {
                        mm.addClass('treeview');
                    }
                }
            },
        },

    });

    window.infoVue = new Vue({
        el: '#alert-info-c',
        data: {
            info: 'message',
        },
    });
    vue.menus = [];
    vue.menus = JSON.parse(getLocalStorage('menus', '[]'));


    vue.$nextTick(function () {
        $('#menus')[0].style.visibility = 'visible';

        let menu = getLocalStorage('click_menu', '');
        let subMenu = getLocalStorage('click_sub_menu', '');

        if (menu === '' || subMenu === '') {
            if (role === '安装队') {
                vue.clickMenuItem('其他内容', '安装队小工具');
            } else {
                vue.clickMenuItem(getLocalStorage('click_menu'), getLocalStorage('click_sub_menu'));
            }
        } else {
            vue.clickMenuItem(menu, subMenu);
        }
    });

    headerVue.userName = getLocalStorage('name', '');
    headerVue.role = getLocalStorage('role', '!!!');
    if (headerVue.role === '!!!') {
        window.location.href = 'login.html?c=' + getQueryVariable('c');
        return;
    }

    window.confirmVue = new Vue({
        el: '#alert-confirm-modal',
        data: {
            title: '',
            message: '',
            buttonTitle: '确定',
        },
        methods: {
            confirmButtonClick: function () {

            },
            confirmCancel: function () {

            }
        }
    });
    window.alertVue = new Vue({
        el: '#alert-info-modal',
        data: {
            title: '',
            message: '',
        },
    });
    window.imgVue = new Vue({
        el: '#image-modal',
        data: {
            imgUrl: '',
        },
        methods: {
            closeImage: function () {
                $('#image-modal').modal('hide');
            }
        }
    });
    window.videoVue = new Vue({
        el: '#video-modal',
        data: {
            videoUrl: '#',
        },
        methods: {
            closeVideo: function () {
                $('#video-modal').modal('hide');
                this.videoUrl = '#';
            }
        }
    });

    setContentHeight();
};

function setContentHeight() {
    let m = $('#main-content')[0];
    let m1 = $('#main-content1')[0];
    if (browserType() === 'Safari') {
        m.height = document.body.clientHeight - document.getElementById('nav').clientHeight;
        m1.height = m.height;
    } else {
        m.height = document.documentElement.clientHeight - document.getElementById('nav').clientHeight;
        m1.height = m.height;
    }
}

window.onresize = function () {
    setContentHeight();
};

function showConfirm(title, message, confirmCallback, cancelCallback = (() => {
})) {
    $('#alert-confirm-modal').modal('show');
    confirmVue.title = title;
    confirmVue.message = message;
    confirmVue.confirmButtonClick = confirmCallback;
    confirmVue.confirmCancel = cancelCallback;
}

function alertInfo(title, message) {
    $('#alert-info-modal').modal('show');
    alertVue.title = title;
    if (typeof message === typeof []) {
        let msg = '';
        for (let i = 0; i < message.length; i++) {
            if (message[i].length > 0) {
                let mi = message[i];
                if (mi.indexOf('失败') > -1) {
                    mi = '<label style="color: red;">' + mi + '</label>';
                } else {
                    mi = '<label>' + mi + '</label>';
                }
                msg += mi + '<br /><br />';
            }
        }
        document.getElementById('message').innerHTML = msg;
    } else {
        alertVue.message = message;
    }
}


function setupContent(url) {
    setTimeout(function () {
        console.log('----------------------------------' + url);
    }, 1000);

    let m = $('#main-content')[0];
    let m1 = $('#main-content1')[0];

    m.src = url;
    m.style.display = 'inline';
    m1.style.display = 'none';
    if (m1.src.length > 0) {
        m1.src = '';
    }
    navigationVue.showCloseButton = false;
    hideProgressTip();
}

function openNewContent(url) {
    setTimeout(function () {
        console.log('----------------------------------' + url);
    }, 1000);
    let m = $('#main-content')[0];
    let m1 = $('#main-content1')[0];
    m.style.display = 'none';
    m1.style.display = 'inline';
    m1.src = url;
    navigationVue.showCloseButton = true;
    localStorage['showCloseButton'] = true;
    localStorage['mainUrl'] = localStorage['contentUrl'];
    navigationVue.$nextTick(function () {
        $('#closeButton')[0].style.visibility = 'visible';
    });
}


function showKey() {
    navigationVue.closeButton = '关闭';
}

function hideKey() {
    navigationVue.closeButton = '关闭';
}

function showBigImage(url) {
    $('#image-modal').modal('show');
    imgVue.imgUrl = url;
}

function showBigVideo(url) {
    $('#video-modal').modal('show');
    videoVue.videoUrl = url;
}

function notifyDataChanged(action = null, data = null) {
    let func = $('#main-content')[0].contentWindow.onDataChanged;
    if (func) {
        func(action, data);
    }
}